<template>
    <div class="main2">
        <div class="main">
            <div class="top">
                <div class="projectname infoclass" v-text="simulationExam.examPaperDTO === undefined ? '' : simulationExam.examPaperDTO.paperName">党建文化考试试卷</div>
                <div class="projectinfo infoclass">本卷共<span class="itemnum" v-text="simulationExam.questionCount">9</span>道试题，
                    考试时间为<span class="itemtime" v-text="simulationExam.examPaperDTO === undefined ? '' : simulationExam.examPaperDTO.suggestTime">90</span>分钟，
                    共<span class="itemscore" v-text="simulationExam.examPaperDTO === undefined ? '' : simulationExam.examPaperDTO.paperScore">102</span>分</div>
            </div>
            <div class="mainbody">
                <div class="left">
                    <div class="infos">
                        <div class="row">
                            <label>项目代码：</label>
                            <span v-text="simulationExam.examPaperDTO === undefined ? '' : simulationExam.examPaperDTO.projectCode">MSAS-001</span>
                        </div>
                        <div class="row">
                            <label>所属单位：</label>
                            <span v-text="simulationExam.userDeptName">某某部门</span>
                        </div>
                        <div class="row">
                            <label>考生姓名：</label>
                            <span v-text="simulationExam.name">张明明</span>
                        </div>
                        <div class="row">
                            <label>考生工号：</label>
                            <span v-text="simulationExam.staffNo">100001</span>
                        </div>
                    </div>
                    <div class="infos" style="margin-top: 10px;">
                        <div class="row">
                            <label>倒计时：</label>
                            <span class="countdown">
                                <span class="countdown"
                                      v-text="timeParams.minute">90</span>
                                :
                                <span class="countdown" v-text="timeParams.second" >60</span>
                            </span>
                        </div>
                        <div class="row" >
                            <label>答题卡：</label>
                            <div class="tabsRight">
                                <!--<div class="circle" v-for="index in simulationExam.questionCount" >
                                    <el-link href="https://element.eleme.io" target="_blank" v-text="index"></el-link>
                                </div>-->
                                <el-button :class="activeClass[index] != null ? answerSheetClass2 : answerSheetClass" plain v-for="index in simulationExam.questionCount"
                                           @click="goAnchor('#q'+index.toString())">
                                    <span style="font-size: 13px;" v-text="index"></span>
                                </el-button>
                                <!--                                <div class="circle active">1</div>-->
                            </div>
                        </div>
                        <div>
                            <!--                     class="submit"       round-->
                            <el-button :loading="buttonLoading" type="primary" style="margin:15px 0px 0px 30px;padding: 10px 70px 10px 70px"  round
                                       @click.native.prevent="handleSubmit('0')">交卷</el-button>
                        </div>
                    </div>
                </div>
                <!--      右侧试卷试题          -->
                <div class="right">
                    <div class="iteminfo"
                         v-if="simulationExam.examPaperDTO === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType0 === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType0[0].questionType === '0' ? true : false " >
                        <div class="itemType">单选题</div>
                        <div class="itemrow" v-for="(q,index) in simulationExam.examPaperDTO.questionCopyDTOMap.questionType0" :id="'q'+q.questionOrder.toString()">
                            <!--                       题干     -->
                            <label>
                            <span v-html="q.questionOrder+'.'+q.questionStems">1.中国共产党党员是中的有共产主义觉悟的先锋战士。中的有共产主义觉悟的先锋战士。中的有共产主义觉悟的先锋战士。
                            中的有共产主义觉悟的先锋战士。中的有共产主义觉悟的先锋战士。中的有共产主义觉悟的先锋战士。中的有共产主义觉悟的先锋战士。</span>
                                <span style="margin-left: 5px;color: #00b7ee" v-if="questionScoreOpen">({{q.score}}分)</span>
                            </label>
                            <!--                      选项      -->
                            <!--<div v-for="(o,index) in q.questionOptionList">
                                <input name="Fruit" type="radio" :value="o.optionTag" @change="radioChange" /><label/>
                                <span v-html="o.optionTag+'.'+o.optionContent">A. 选项选项选项选项选项选项选项选项选项</span>
                            </div>-->
                            <div style="margin: 10px 33px 0 -18px;">
                                <el-radio-group v-model="changeArray[q.questionOrder]" >
                                    <el-radio style="width: 100%;margin-bottom: 10px;"
                                              v-for="(o,index) in q.questionOptionList"
                                              :key="index"
                                              :label="String.fromCharCode('A'.charCodeAt(0) + index)"
                                              @change="radioOption(q,String.fromCharCode('A'.charCodeAt(0) + index),o.optionContent)"
                                    ><span v-html="String.fromCharCode('A'.charCodeAt(0) + index)+'.'+o.optionContent">A. 选项选项选项选项选项选项选项选项选项</span></el-radio>
                                </el-radio-group>
                            </div>
                            <!--                        参考解析     -->
                            <div v-if="q.isOpenQuestionParse">
                                <el-link :underline="false">
                                <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                      v-if="!q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    查看答案<i class="el-icon-arrow-down el-icon--right"></i>
                                </span>
                                    <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                          v-if="q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    隐藏答案<i class="el-icon-arrow-up el-icon--right"></i>
                                </span>
                                </el-link>
                                <div style="margin: 0px;" v-if="q.isQuestionParse">
                                    <span>正确答案：</span>
                                    <div>
                                        <span v-html="q.standardAnswer"></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="iteminfo"
                         v-if="simulationExam.examPaperDTO === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType1 === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType1[0].questionType === '1' ? true : false " >
                        <div class="itemType">多选题</div>
                        <div class="itemrow" v-for="(q,index) in simulationExam.examPaperDTO.questionCopyDTOMap.questionType1" :id="'q'+q.questionOrder.toString()">
                            <!--                       题干     -->
                            <label>
                                <span v-html="q.questionOrder+'.'+q.questionStems">1.中国共产党党员是          中的有共产主义觉悟的先锋战士。</span>
                                <span style="margin-left: 5px;color: #00b7ee" v-if="questionScoreOpen">({{q.score}}分)</span>
                            </label>
                            <!--                     选项       -->
                            <!-- <div v-for="(o,index) in q.questionOptionList">
                                 <input name="Fruit" type="checkbox" :value="o.optionTag" /><label/>
                                 <span v-html="o.optionTag+'.'+o.optionContent">A. 选项选项选项选项选项选项选项选项选项选项</span>
                             </div>-->
                            <div style="margin: 10px 33px 0 -18px;">
                                <el-checkbox-group v-model="checkArray[q.questionOrder]">
                                    <el-checkbox style="width: 100%;margin-bottom: 10px;"
                                                 v-for="(o,index) in q.questionOptionList"
                                                 :key="index"
                                                 :label="String.fromCharCode('A'.charCodeAt(0) + index)+','+o.optionContent"
                                                 @change="checkOption(q)"
                                    ><span v-html="String.fromCharCode('A'.charCodeAt(0) + index)+'.'+o.optionContent">A. 选项选项选项选项选项选项选项选项选项</span></el-checkbox>
                                </el-checkbox-group>
                            </div>
                            <!--                        参考解析     -->
                            <div v-if="q.isOpenQuestionParse">
                                <el-link :underline="false">
                                <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                      v-if="!q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    查看答案<i class="el-icon-arrow-down el-icon--right"></i>
                                </span>
                                    <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                          v-if="q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    隐藏答案<i class="el-icon-arrow-up el-icon--right"></i>
                                </span>
                                </el-link>
                                <div style="margin: 0px;" v-if="q.isQuestionParse">
                                    <span>正确答案：</span>
                                    <div>
                                        <span v-html="q.standardAnswer"></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="iteminfo"
                         v-if="simulationExam.examPaperDTO === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType2 === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType2[0].questionType === '2' ? true : false " >
                        <div class="itemType">判断题</div>
                        <div class="itemrow" v-for="(q,index) in simulationExam.examPaperDTO.questionCopyDTOMap.questionType2" :id="'q'+q.questionOrder.toString()" >
                            <!--                    题干        -->
                            <label>
                                <span v-html="q.questionOrder+'.'+q.questionStems">1.中国共产党党员是                     中的有共产主义觉悟的先锋战士。</span>
                                <span style="margin-left: 5px;color: #00b7ee" v-if="questionScoreOpen">({{q.score}}分)</span>
                            </label>
                            <!--                     选项       -->
                            <div style="margin: 10px 33px 0 -18px;">
                                <el-radio-group v-model="q.examAnswerPaperDTO.userAnswer" >
                                    <el-radio style="width: 100%;margin-bottom: 10px;"
                                              label="0"
                                              @change="estimateOption(q)"
                                    ><span>正确</span></el-radio>
                                    <el-radio style="width: auto;"
                                              label="1"
                                              @change="estimateOption(q)"
                                    ><span>错误</span></el-radio>
                                </el-radio-group>
                            </div>
                            <!--<div><input name="Fruit" type="radio" value="0" /><label/>正确</div>
                            <div><input name="Fruit" type="radio" value="1" /><label/>错误</div>-->
                            <!--                        参考解析     -->
                            <div v-if="q.isOpenQuestionParse">
                                <el-link :underline="false">
                                <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                      v-if="!q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    查看答案<i class="el-icon-arrow-down el-icon--right"></i>
                                </span>
                                    <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                          v-if="q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    隐藏答案<i class="el-icon-arrow-up el-icon--right"></i>
                                </span>
                                </el-link>
                                <div style="margin: 0px;" v-if="q.isQuestionParse">
                                    <span>正确答案：</span>
                                    <div>
                                        <span v-html="q.standardAnswer === '0' ? '正确':'错误' "></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="iteminfo"
                         v-if="simulationExam.examPaperDTO === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType3 === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType3[0].questionType === '3' ? true : false " >
                        <div class="itemType">填空题</div>
                        <div class="itemrow" v-for="(q,index) in simulationExam.examPaperDTO.questionCopyDTOMap.questionType3" :id="'q'+q.questionOrder.toString()">
                            <!--                        题干    -->
                            <label>
                                <span v-html="q.questionOrder+'.'+q.questionStems">1.中国共产党党员是  中的有共产主义觉悟的先锋战士。</span>
                                <span style="margin-left: 5px;color: #00b7ee" v-if="questionScoreOpen">({{q.score}}分)</span>
                            </label>
                            <!--                        答题栏    -->
                            <div class="answerClass">
                                <input name="Fruit" type="text" class="underlineinput"
                                       :disabled=" '1' === queryParams.examType ? true : false "
                                       :placeholder=" '1' === queryParams.examType ? '无需作答' : '请填写答案！' "
                                       v-model="q.examAnswerPaperDTO.answerContent" @click="openRichText(q)"/>
                            </div>
                            <!--                        参考解析     -->
                            <div v-if="q.isOpenQuestionParse">
                                <el-link :underline="false">
                                <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                      v-if="!q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    查看答案<i class="el-icon-arrow-down el-icon--right"></i>
                                </span>
                                    <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                          v-if="q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    隐藏答案<i class="el-icon-arrow-up el-icon--right"></i>
                                </span>
                                </el-link>
                                <div style="margin: 0px;" v-if="q.isQuestionParse">
                                    <span>参考答案：</span>
                                    <div>
                                        <span v-html="q.questionParse"></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="iteminfo"
                         v-if="simulationExam.examPaperDTO === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType4 === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType4[0].questionType === '4' ? true : false " >
                        <div class="itemType">简答题</div>
                        <div class="itemrow" v-for="(q,index) in simulationExam.examPaperDTO.questionCopyDTOMap.questionType4" :id="'q'+q.questionOrder.toString()">
                            <!--                     题干       -->
                            <label>
                                <span v-html="q.questionOrder+'.'+q.questionStems">1.中国共产党党员是  中的有共产主义觉悟的先锋战士。</span>
                                <span style="margin-left: 5px;color: #00b7ee" v-if="questionScoreOpen">({{q.score}}分)</span>
                            </label>
                            <!--                   答题栏         -->
                            <div class="answerClass">
                                <input name="Fruit" type="text" class="underlineinput"
                                       :disabled=" '1' === queryParams.examType ? true : false "
                                       :placeholder=" '1' === queryParams.examType ? '无需作答' : '请填写答案！' "
                                       v-model="q.examAnswerPaperDTO.answerContent" @click="openRichText(q)" />
                            </div>
                            <!--                        参考解析     -->
                            <div v-if="q.isOpenQuestionParse">
                                <el-link :underline="false">
                                <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                      v-if="!q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    查看答案<i class="el-icon-arrow-down el-icon--right"></i>
                                </span>
                                    <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                          v-if="q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    隐藏答案<i class="el-icon-arrow-up el-icon--right"></i>
                                </span>
                                </el-link>
                                <div style="margin: 0px;" v-if="q.isQuestionParse">
                                    <span>参考答案：</span>
                                    <div>
                                        <span v-html="q.questionParse"></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="iteminfo"
                         v-if="simulationExam.examPaperDTO === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType5 === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType5[0].questionType === '5' ? true : false " >
                        <div class="itemType">论述题</div>
                        <div class="itemrow" v-for="(q,index) in simulationExam.examPaperDTO.questionCopyDTOMap.questionType5" :id="'q'+q.questionOrder.toString()">
                            <!--                        题干    -->
                            <label>
                                <span v-html="q.questionOrder+'.'+q.questionStems">1.中国共产党党员是    中的有共产主义觉悟的先锋战士。</span>
                                <span style="margin-left: 5px;color: #00b7ee" v-if="questionScoreOpen">({{q.score}}分)</span>
                            </label>
                            <!--                        答题栏    -->
                            <div class="answerClass">
                                <input name="Fruit" type="text" class="underlineinput"
                                       :disabled=" '1' === queryParams.examType ? true : false "
                                       :placeholder=" '1' === queryParams.examType ? '无需作答' : '请填写答案！' "
                                       v-model="q.examAnswerPaperDTO.answerContent" @click="openRichText(q)" />
                            </div>
                            <!--                        参考解析     -->
                            <div v-if="q.isOpenQuestionParse">
                                <el-link :underline="false">
                                <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                      v-if="!q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    查看答案<i class="el-icon-arrow-down el-icon--right"></i>
                                </span>
                                    <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                          v-if="q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    隐藏答案<i class="el-icon-arrow-up el-icon--right"></i>
                                </span>
                                </el-link>
                                <div style="margin: 0px;" v-if="q.isQuestionParse">
                                    <span>参考答案：</span>
                                    <div>
                                        <span v-html="q.questionParse"></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="iteminfo"
                         v-if="simulationExam.examPaperDTO === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType6 === undefined ? false : simulationExam.examPaperDTO.questionCopyDTOMap.questionType6[0].questionType === '6' ? true : false " >
                        <div class="itemType">计算题</div>
                        <div class="itemrow" v-for="(q,index) in simulationExam.examPaperDTO.questionCopyDTOMap.questionType6" :id="'q'+q.questionOrder.toString()">
                            <!--                        题干    -->
                            <label>
                                <span v-html="q.questionOrder+'.'+q.questionStems">1.中国共产党党员是  中的有共产主义觉悟的先锋战士。</span>
                                <span style="margin-left: 5px;color: #00b7ee" v-if="questionScoreOpen">({{q.score}}分)</span>
                            </label>
                            <!--                       答题栏     -->
                            <div class="answerClass">
                                <input name="Fruit" type="text" class="underlineinput" v-model="q.examAnswerPaperDTO.answerContent"
                                       :disabled=" '1' === queryParams.examType ? true : false "
                                       :placeholder=" '1' === queryParams.examType ? '无需作答' : '请填写答案！' "
                                       @click="openRichText(q)"/>
                            </div>
                            <!--                        参考解析     -->
                            <div v-if="q.isOpenQuestionParse">
                                <el-link :underline="false">
                                <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                      v-if="!q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    查看答案<i class="el-icon-arrow-down el-icon--right"></i>
                                </span>
                                    <span class="el-dropdown-link" style="color: rgb(76, 123, 244);font-size: 15px;"
                                          v-if="q.isQuestionParse" @click="handlerQuestionParse(q)">
                                    隐藏答案<i class="el-icon-arrow-up el-icon--right"></i>
                                </span>
                                </el-link>
                                <div style="margin: 0px;" v-if="q.isQuestionParse">
                                    <span>参考答案：</span>
                                    <div>
                                        <span v-html="q.questionParse"></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 富文本工具 -->
            <el-dialog :visible.sync="open" v-if="open" width="800px" append-to-body>
                <rich-text ref="richText" :params="params" @submitContent="submitContent" @cancelRichText="cancelRichText"></rich-text>
            </el-dialog>
        </div>
    </div>
</template>

<script>
    import screenfull from 'screenfull'
    import {getExamPaperQuestion, submitPaper} from "@/api/exam/exam";
    import {getExamSettingByPlanId} from "@/api/exam/examSetting";
    import {parseTime} from "@/utils/boostor";
    import richText from "@/views/question/question/util/ueditor"
    import simulateSubmitForm  from "./form/simulateSubmitForm"

    export default {
    name: "answer",
    components: {
        richText,
        simulateSubmitForm
    },
    data() {
        return {
            //富文本开关
            open: false,
            // 试题分数回显,默认回显
            questionScoreOpen: true,
            //传给富文本参数
            params: {
                //内容
                content: '',
                //编辑内容试题（编辑答案所属试题）
                type: undefined,
                //选项下标
                index: undefined
            },
            //按钮遮罩层
            buttonLoading: false,
            // 查询考试试卷条件
            queryParams: {
                paperId: undefined,
                paperType: undefined,
                examType: undefined,
                signUpId: undefined, // 考生ID
                planId: undefined, // 考试计划Id
            },
            // 切屏监听
            fn2: undefined,
            // 无操作监听时长（分钟）
            nopMonitorTimes: null,
            isOvertime: '1', // 是否监听,默认不监听
            answerOvertime: undefined,
            // 是否答完所有题才可交卷(主观题除外)
            isAllQuestion: '1', // 默认否
            // 交卷后是否显示分数
            showScore: '0', // 默认显示 0:是 1:否
            // 考试倒计时监听
            examTimes: null,
            // 考生试卷
            simulationExam: {},
        //    倒计时参数
            timeParams: {
                minute: undefined, // 分钟
                second: 0, // 秒
            },
            // 答题卡动态样式
            activeClass: [],
            answerSheetClass: 'circle',
            answerSheetClass2: 'circle active',
            // 选项选中
            changeArray: [],
            // 多选框选中
            checkArray: [[]],
            // 试卷提交表单
            form: {
                //提交类型（0：考试，1：模拟考试，2：持续评估考试，3：阅卷）
                submitType: undefined,
                answerDate: undefined,//答题用时（分钟）
                remainingTime: undefined, // 剩余用时（分钟）
                examStatus: undefined,
                planId: undefined, // 考试计划Id
                submitDate: undefined,//交卷时间
                paperId: undefined,//试卷ID
                signUpId: undefined, //考生报名ID
                questionCount: undefined, //试题总数
                projectCode: undefined, // 项目代码
                // 考试试题及所属答题记录
                questionCopyDTOList: [],
            },
        }
    },
    created() {
        // 获取路径参数
        let result = this.getParams(window.location.hash);
        console.log(result)
        this.queryParams.paperId = result.paperId;
        this.queryParams.paperType = result.paperType;
        this.queryParams.examType = result.examType;
        this.queryParams.signUpId = result.signUpId; // 考生Id
        this.queryParams.planId = result.planId; // 考试计划Id
        // 答题类型、试卷ID
        this.form.submitType = result.examType;
        this.form.paperId = result.paperId;
        // 初始化试卷信息
        this.getPaperInfo();
        // 初始化考试设置
        this.getExamPlanSetting();
        /*this.$alert('确定开始答题？', '提示', {
            confirmButtonText: '确定',
            callback: action => {
            //    全屏展示
                this.setFullScreen();
            // 初始化试卷信息
                this.getPaperInfo();
            }
        });*/
    },
    beforeDestroy() {
        // alert("页面销毁时！");
        // 移除切屏监听事件
        document.removeEventListener("visibilitychange",this.fn2,false);
        // 停止无答题操作监控
        clearTimeout(this.nopMonitorTimes);
        this.nopMonitorTimes = null;
        // 停止考试倒计时
        clearInterval(this.examTimes);
        this.examTimes = null;
    },
    methods: {
        // 浏览器限制无法自动全屏，考虑在页面中点击开始考试时处理
        setFullScreen() {
            if (!screenfull.enabled) {
                this.$message({message: '你的浏览器不支持全屏', type: 'warning'})
                return false
            }
            screenfull.toggle()
        },
        // 监听切屏 max 切屏最大次数
        monitorScreen(max) {
            let n = 0;
            let fn = function () {
                if (document.visibilityState == 'hidden') {
                    n++;
                } else if (document.visibilityState == 'visible') {
                    if (n > max) {
                        this.$alert('你已经切换离开考试页面超过' + max + "次系统将自动提交答卷！", '警告', {
                            confirmButtonText: '知道了',
                            callback: action => {
                                // this.msgSuccess("系统自动提交答卷！");
                                // 自动提交试卷 3：异常，0：以参考
                                this.handleAutoSubmit('0');
                            }
                        });
                        return;
                    }
                    this.$alert('你已经切换离开考试页面' + n + '次，如果超过' + max + "次系统会自动提交答卷，请认真作答！", '提示', {
                        confirmButtonText: '知道了',
                        callback: action => {
                        }
                    });
                }
            }
            if (max > 0) {
                this.fn2 = fn.bind(this); // 间接绑定this,便于事件销毁
                // 使用bind绑定的事件才是指向函数，否则指向的是调用addEventListener的对象
                document.addEventListener("visibilitychange", this.fn2,false);
            } else {
                // 移除visibilitychange监听切屏事件
                console.log("移除切屏事件监听");
                document.removeEventListener("visibilitychange",this.fn2,false);
            }
        },
        // 禁止复制、剪切、粘贴 b: true 不禁止
        forbidCopyPaste(b) {
            // 更加严格的禁止作弊设置
            // 禁止鼠标右键
            window.oncontextmenu = function () { return b; };
            // 禁止选中网页上内容
            window.onselectstart = function () { return b; };
            // （防止F12和shift+ctrl+i调起开发者工具）
            window.onkeydown = window.onkeyup = window.onkeypress = function () {
                window.event.returnValue = b;
                return b;
            }
        },
        // 无答题操作监听自动交卷
        nopMonitor(minute) {
            console.log("----开始无答题操作监听---仅监听客观题----");
            // 计算出毫秒级监听时长
            var maxtime = minute * 60 * 1000;
            let fn2 = function () {
                    clearTimeout(this.nopMonitorTimes);
                    this.nopMonitorTimes = null;
                    // 判断是否答完了所有题（客观题），如果是则不交卷，不是则自动交卷
                    // 总题数
                    var questionCount = this.simulationExam.questionCount;
                    // 已作答题数
                    var length = this.form.questionCopyDTOList.length;
                    const number =  questionCount - length;
                    if (number === 0) { // 答完了则不交卷
                        console.log("无答题操作监听结束---仅监听客观题！")
                        return;
                    }
                    // 还有客观题未答则自动交卷
                    this.$alert("检测到考生长时间未答题操作，系统将自动交卷!", '警告', {
                        confirmButtonText: '知道了',
                        callback: action => {
                            // 自动提交试卷 3：异常，0：已参考
                            this.handleAutoSubmit('0');
                        }
                    });
            }
            // 开始倒计时
            this.nopMonitorTimes = setTimeout(fn2.bind(this),maxtime); //监听毫秒数过后执行
        },
        // 监听提示临时使用
       /* nopMsg (minutes, seconds) {
            var msg = "距离考试结束还有" + minutes + "分" + seconds + "秒";
            console.log(msg);
        },*/
        // 获取该场考试的考试设置
        getExamPlanSetting() {
            // 证书考试和持续评估考试才会触发
            if ('0' === this.queryParams.examType || '2' === this.queryParams.examType) {
                getExamSettingByPlanId(this.queryParams.planId).then(res => {
                    const examSetting =  res.responseBody; // 考试设置
                    if ('0' === examSetting.isCut) { // 判断是否开启了
                        //    监听切屏 参数：切屏次数
                        this.monitorScreen(examSetting.cutNumber);
                    }
                    // 判断是否禁止拷贝
                    const b = '0' === examSetting.isBan ? false : true
                    //    禁止复制拷贝粘贴 true：不禁止
                        this.forbidCopyPaste(b);
                    // 显示试题分数
                    if ('0' === examSetting.isQuestionScore) {
                        // console.log("----- 显示试题分数 -----");
                        this.questionScoreOpen = true;
                    } else {
                        // console.log("----- 不显示试题分数 -----");
                        this.questionScoreOpen = false;
                    }
                    // 长时间无答题操作监听是否开启
                    if ('0' === examSetting.isOvertime) { // 开启
                        this.isOvertime = '0'; // 开启
                        this.answerOvertime = examSetting.answerOvertime; // 监听时长
                        this.nopMonitor(this.answerOvertime); // 开始监听
                    }
                    // 是否答完所有题才交卷（除主观题外） 0:是 1:否
                    if ('0' === examSetting.isAllQuestion) {
                        this.isAllQuestion = '0';
                    }
                //    交卷后是否显示分数
                    this.showScore = '0' === examSetting.showScore ? '0' : '1';
                }).catch(err => {});
            }
        },
        // 自动提交试卷
        handleAutoSubmit(examStatus) {
            this.buttonLoading = true;
            // 总题数
            var questionCount = this.simulationExam.questionCount;
            // 答题用时=总时长-剩余时长
            this.form.answerDate = this.simulationExam.examPaperDTO.suggestTime - this.timeParams.minute
            if ('0' === this.queryParams.examType || '2' === this.queryParams.examType ) { // 在线考试
                // 在线考试剩余时间
                this.form.remainingTime = this.timeParams.minute;
                this.form.examStatus = examStatus; // 考试状态：0:已参考,1:考试中,2:缺考,3:异常,4:正常
                this.form.signUpId = this.queryParams.signUpId;
                this.form.planId = this.queryParams.planId; // 考试计划Id
            }
            this.form.submitDate = parseTime(new Date()); // 提交日期
            this.form.questionCount = questionCount; // 试题总数
            this.form.projectCode = this.simulationExam.examPaperDTO.projectCode; // 项目代码
            // console.log("交卷表单信息：", this.form);
            submitPaper(this.form).then(res => {
                this.buttonLoading = false;
                // 提交试卷后跳转答题结果页面
                var scoreType = res.responseBody.scoreType;
                var scoreId = res.responseBody.scoreId;
                this.closeExamSetting(); // 关闭所有监控
                var routeUrl = this.$router.resolve( {
                    path: '/simulate-submit?scoreId='+scoreId+'&showScore='+this.showScore // 携带成绩Id和是否显示成绩标识
                });
                // 重定向页面--》答题结果页面
                window.location.replace(routeUrl.href);

            })
        },
        ss() {
            //    监听切屏 参数：切屏次数
            this.monitorScreen(0);
        },
        // 手动提交试卷
        handleSubmit(examStatus) {
            this.buttonLoading = true;
            if (this.form.questionCopyDTOList.length <= 0) {
                this.msgWarning("你还未作答，不能交卷！");
                this.buttonLoading = false;
                return;
            }
            // 总题数
            var questionCount = this.simulationExam.questionCount;
            // 已作答题数
            var length = this.form.questionCopyDTOList.length;
            const number =  questionCount - length;
            if (number > 0 && '0' === this.isAllQuestion) { // 有未答题且防作弊答完所有题开启
                this.msgWarning("必须答完所有题，才可交卷（除主观题外）！");
                this.buttonLoading = false;
                return;
            }
            var msg = '确认交卷吗？';
            if (number > 0) {
                msg = '你还有' + number + '道题目未作答，确认交卷吗？';
            }
            this.$confirm(msg, '提示', {
                confirmButtonText: '确认交卷',
                cancelButtonText: '继续答题',
                type: 'warning'
            }).then(() => {
                // 答题用时=总时长-剩余时长
                this.form.answerDate = this.simulationExam.examPaperDTO.suggestTime - this.timeParams.minute
                if ('0' === this.queryParams.examType || '2' === this.queryParams.examType ) { // 在线考试
                    // 在线考试剩余时间
                    this.form.remainingTime = this.timeParams.minute;
                    this.form.examStatus = examStatus; // 考试状态：0:已参考,1:考试中,2:缺考,3:异常,4:正常
                    this.form.signUpId = this.queryParams.signUpId;
                    this.form.planId = this.queryParams.planId; // 考试计划Id
                }
                this.form.submitDate = parseTime(new Date()); // 提交日期
                this.form.questionCount = questionCount; // 试题总数
                this.form.projectCode = this.simulationExam.examPaperDTO.projectCode; // 项目代码
                // console.log("交卷表单信息：", this.form);
                submitPaper(this.form).then(res => {
                    this.buttonLoading = false;
                    // 提交试卷后跳转答题结果页面
                    var scoreType = res.responseBody.scoreType;
                    var scoreId = res.responseBody.scoreId;
                    this.closeExamSetting(); // 关闭所有监控
                    var routeUrl = this.$router.resolve( {
                        path: '/simulate-submit?scoreId='+scoreId+'&showScore='+this.showScore // 携带成绩Id和是否显示成绩标识
                    });
                    // 重定向页面--》答题结果页面
                    window.location.replace(routeUrl.href);
                })
            }).catch(() => {
                this.buttonLoading = false;
                this.msgWarning("继续答题!");
            });
        },
        // 关闭考试设置所有监控
        closeExamSetting() {
            //    取消监听切屏 参数：切屏次数
            this.monitorScreen(0);
            // 取消禁止复制、粘贴、拷贝
            console.log("关闭禁止复制、粘贴、拷贝")
            this.forbidCopyPaste(true);
            // 停止无答题操作监控
            console.log("关闭无答题操作监控")
            clearTimeout(this.nopMonitorTimes);
            this.nopMonitorTimes = null;
            // 停止考试倒计时
            console.log("关闭考试倒计时")
            clearInterval(this.examTimes);
            this.examTimes = null;
        },
        // 截取浏览器路径参数
        getParams(url) {
            let res = {}
            if (url.includes('?')) {
                let str = url.split('?')[1]
                let arr = str.split('&')
                for (let item of arr) {
                    let key = item.split('=')[0]
                    let value = item.split('=')[1]
                    res[key] = decodeURIComponent(value)
                }
            }
            return res
        },
        // 考试用时倒计时
        countDown() {
            // 计算出秒级考试时长
            var maxtime = this.timeParams.minute * 60;
            let fn = function () {
                if (maxtime >= 0) {
                    var minutes = Math.floor(maxtime / 60);
                    var seconds = Math.floor(maxtime % 60);
                    // 刷新剩余考试时长分钟和秒
                    this.timeParams.minute = minutes;
                    this.timeParams.second = seconds;
                    --maxtime;
                } else {
                    clearInterval(this.examTimes); // 停止考试倒计时
                    this.examTimes = null;
                    alert("时间到，考试结束!");
                    // 提交试卷 3：异常，0：以参考
                    this.handleSubmit('3');
                }
            }
            // 开始倒计时
            this.examTimes = setInterval(fn.bind(this), 1000); //1000毫秒后执行
        },
        // 瞄点跳转
        goAnchor(index) {
            console.log("瞄点跳转 试题序号：", index);
            document.querySelector(index).scrollIntoView({
                behavior: 'smooth'
            });
        },
        //单选题选中选项保存记录
        radioOption(q, label, optionContent) {
            // console.log("=== 选择了选项 ===",label+'==='+optionContent+"，对应试题ID：",q.questionId);
            // console.log("=== 选择了选项 ===",this.changeArray);
            // 绑定单选题答题内容
            q.examAnswerPaperDTO.userAnswer = label; // 答题选项标识
            q.examAnswerPaperDTO.answerContent = optionContent; // 选项内容
            q.examAnswerPaperDTO.questionId = q.questionId; // 选项绑定试卷试题Id
            // 单选框添加前先去重，同一单选试题只能存储一个答题记录
            for (let i = 0; i < this.form.questionCopyDTOList.length; i++) {
                const questionCopy = this.form.questionCopyDTOList[i];
                const questionId = questionCopy.examAnswerPaperDTO.questionId;
                if (q.examAnswerPaperDTO.questionId === questionId) {
                    this.form.questionCopyDTOList.splice(i, 1); // 移除
                }
            }
            // 添加到考试答题记录表单中
            this.form.questionCopyDTOList.push(q);
            //    改变答题卡样式
            this.activeClass[q.questionOrder] = q.questionOrder;
            // 监听无答题操作
            if ('0' === this.isOvertime) {
                if (this.nopMonitorTimes !== null) {
                    // console.log("======",this.nopMonitorTimes);
                    clearTimeout(this.nopMonitorTimes);
                    this.nopMonitor(this.answerOvertime);
                }
            }
        },
        // 多选框选中保存记录
        checkOption(q) {
            // console.log("=== 选择了选项 ===",this.checkArray[q.questionOrder]+"-- 对应试题ID：",q.questionId);
            // console.log("=== 选择了多选项 ===",this.checkArray);
            //    改变答题卡样式
            if (this.checkArray[q.questionOrder].length === 0) {
                // 切换答题卡样式为未选择
                this.activeClass[q.questionOrder] = null;
                // 多选框添加前先去重，同一多选试题只能存储一个答题记录
                for (let i = 0; i < this.form.questionCopyDTOList.length; i++) {
                    const questionCopy = this.form.questionCopyDTOList[i];
                    const questionId = questionCopy.examAnswerPaperDTO.questionId;
                    if (q.examAnswerPaperDTO.questionId === questionId) {
                        this.form.questionCopyDTOList.splice(i, 1); // 移除
                    }
                }
                // 清空该试题绑定的答题记录
                q.examAnswerPaperDTO.userAnswer = null;
                q.examAnswerPaperDTO.answerContent = null;
                q.examAnswerPaperDTO.questionId = null;
                // 监听无答题操作
                if ('0' === this.isOvertime) {
                    if (this.nopMonitorTimes !== null) {
                        clearTimeout(this.nopMonitorTimes);
                        this.nopMonitor(this.answerOvertime);
                    }
                }
                return;
            }
            // 切换答题卡样式为已选择
            this.activeClass[q.questionOrder] = q.questionOrder;
            // 遍历解析多选题已选中选项标识和内容
            //A,<p>错误</p>,B,<p>正确的</p>
            let optionTags = [];
            let optionContents = [];
            for (let i = 0; i < this.checkArray[q.questionOrder].length; i++) {
                // 已选中的选项[结构：(选项,选项内容) A,<p>错误</p>]
                const check = this.checkArray[q.questionOrder][i];
                const optionTag = check.split(',')[0];
                const optionContent = check.split(',')[1];
                optionTags.push(optionTag);
                optionContents.push(optionContent);
            }
            // 绑定多选题答题内容
            q.examAnswerPaperDTO.userAnswer = optionTags.toString(); // 答题选项标识
            q.examAnswerPaperDTO.answerContent = optionContents.toString(); // 选项内容
            q.examAnswerPaperDTO.questionId = q.questionId; // 选项绑定试卷试题Id
            // 多选框添加前先去重，同一多选试题只能存储一个答题记录
            for (let i = 0; i < this.form.questionCopyDTOList.length; i++) {
                const questionCopy = this.form.questionCopyDTOList[i];
                const questionId = questionCopy.examAnswerPaperDTO.questionId;
                if (q.examAnswerPaperDTO.questionId === questionId) {
                    this.form.questionCopyDTOList.splice(i, 1); // 移除
                }
            }
            // 添加试题及答题记录到考试试题及所属答题记录表单中
            this.form.questionCopyDTOList.push(q);
            // 监听无答题操作
            if ('0' === this.isOvertime) {
                if (this.nopMonitorTimes !== null) {
                    clearTimeout(this.nopMonitorTimes);
                    this.nopMonitor(this.answerOvertime);
                }
            }
            // console.log("已选择选项标识：",optionTags.toString());
            // console.log("已选择选项内容：",optionContents.toString());
        },
        // 判断题选中答题卡更换样式
        estimateOption(q) {
            q.examAnswerPaperDTO.questionId = q.questionId; // 选项绑定试卷试题Id
            // 单选框添加前先去重，同一判断题只能存储一个答题记录
            for (let i = 0; i < this.form.questionCopyDTOList.length; i++) {
                const questionCopy = this.form.questionCopyDTOList[i];
                const questionId = questionCopy.examAnswerPaperDTO.questionId;
                if (q.examAnswerPaperDTO.questionId === questionId) {
                    this.form.questionCopyDTOList.splice(i, 1); // 移除
                }
            }
            // 添加到考试试题及所属答题记录表单中
            this.form.questionCopyDTOList.push(q);
            //    改变答题卡样式
            this.activeClass[q.questionOrder] = q.questionOrder;
            // 监听无答题操作
            if ('0' === this.isOvertime) {
                if (this.nopMonitorTimes !== null) {
                    clearTimeout(this.nopMonitorTimes);
                    this.nopMonitor(this.answerOvertime);
                }
            }
        },
        // 打开富文本
        openRichText(q){
            this.params.type = q;
            this.params.content = q.examAnswerPaperDTO.answerContent;
            this.open = true;
        },
        //回填富文本内容
        // type：答案所属试题
        submitContent(content,q,optionIndex){
            // console.log('content:',content,',type:',q,',optionIndex:',optionIndex)
            q.examAnswerPaperDTO.answerContent = content; // 答案填充
            q.examAnswerPaperDTO.questionId = q.questionId; // 选项绑定试卷试题Id
            // 答题卡样式切换
            if (content === '') {
                this.activeClass[q.questionOrder] = null; // 取消已作答样式
            //    移除表单中记录的对应试题及答题记录
                for (let i = 0; i < this.form.questionCopyDTOList.length; i++) {
                    const questionCopy = this.form.questionCopyDTOList[i];
                    const questionId = questionCopy.examAnswerPaperDTO.questionId;
                    if (q.examAnswerPaperDTO.questionId === questionId) {
                        this.form.questionCopyDTOList.splice(i, 1); // 移除
                    }
                }
            } else {
                this.activeClass[q.questionOrder] = q.questionOrder; // 添加已作答样式
                //    移除表单中记录的对应试题及答题记录
                for (let i = 0; i < this.form.questionCopyDTOList.length; i++) {
                    const questionCopy = this.form.questionCopyDTOList[i];
                    const questionId = questionCopy.examAnswerPaperDTO.questionId;
                    if (q.examAnswerPaperDTO.questionId === questionId) {
                        this.form.questionCopyDTOList.splice(i, 1); // 移除
                    }
                }
                // 添加试题及答题记录到考试试题及所属答题记录表单中
                this.form.questionCopyDTOList.push(q);
            }
            this.open = false;
        },
        //关闭富文本
        cancelRichText(){
            this.open = false;
        },
        // 查看或隐藏正确答案或参考解析
        handlerQuestionParse(q) {
            q.isQuestionParse = !q.isQuestionParse
        },
        // 获取考试试卷信息
        getPaperInfo() {
            this.loading = true;
            getExamPaperQuestion(this.queryParams).then(response => {
                if (response.retCode === '200') {
                    // 获取考试试卷
                    this.simulationExam = response.responseBody
                    // 判断是否具有单选题 查看是否有答题记录并回显
                    if (this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType0 !== undefined) {
                        for (let i = 0; i < this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType0.length; i++) {
                            const q = this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType0[i];
                            if (q.examAnswerPaperDTO.answerContent === null) { // 没有答题记录
                                this.changeArray = new Array();
                            } else { // 有答题记录，不能直接赋值，试题选项每次有乱序
                                var answerContent = q.examAnswerPaperDTO.answerContent; // 答题内容
                                var questionOptionList = JSON.parse(JSON.stringify(q.questionOptionList)); // 试题选项数组(深拷贝)
                                for (let k = 0; k < questionOptionList.length; k++) {
                                    var questionOption = questionOptionList[k]; // 选项信息
                                    var optionContent = questionOption.optionContent; // 选项内容
                                    if (optionContent === answerContent) {
                                        questionOptionList.splice(k, 1); // 移除
                                        // options.push(questionOption.optionTag+','+answerContent);
                                        this.changeArray[q.questionOrder] = questionOption.optionTag;
                                        this.radioOption(q,questionOption.optionTag,optionContent); // 单选框选中保存记录
                                        continue;
                                    }
                                }
                            }
                        }
                    }
                    //创建空二维数据存放多选题答案 查看是否有答题记录并回显
                    if (this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType1 !== undefined) {
                        for (let i = 0; i < this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType1.length; i++) {
                            const q = this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType1[i];
                            if (q.examAnswerPaperDTO.answerContent === null) { // 没有答题记录
                                this.checkArray[q.questionOrder] = new Array();
                            } else { // 有答题记录，不能直接赋值，试题选项每次有乱序
                                var strings = q.examAnswerPaperDTO.answerContent.split(','); // 答题内容数组
                                var options = []; // 临时存储多选题答题记录选项
                                var questionOptionList = JSON.parse(JSON.stringify(q.questionOptionList)); // 试题选项数组(深拷贝)
                                for (let j = 0; j < strings.length; j++) {
                                    var answerContent = strings[j]; // 答题答案
                                    for (let k = 0; k < questionOptionList.length; k++) {
                                        var questionOption = questionOptionList[k]; // 选项信息
                                        var optionContent = questionOption.optionContent; // 选项内容
                                        if (optionContent === answerContent) {
                                            questionOptionList.splice(k, 1); // 移除
                                            options.push(questionOption.optionTag+','+answerContent);
                                            continue;
                                        }
                                    }
                                }
                                this.checkArray[q.questionOrder] = options;
                                this.checkOption(q); // 多选框选中保存记录
                            }
                        }
                    }
                    // 判断题 查看是否有答题记录并回显
                    if (this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType2 !== undefined) {
                        for (let i = 0; i < this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType2.length; i++) {
                            const q = this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType2[i];
                            if (q.examAnswerPaperDTO.userAnswer === null) { // 没有答题记录
                            } else { // 有答题记录
                                this.estimateOption(q);
                            }
                        }
                    }
                    // 证书考试和持续评估考试才回显和添加答题记录到表单
                    if ('0' === this.queryParams.examType || '2' === this.queryParams.examType) {
                        // 填空题 查看是否有答题记录并回显
                        if (this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType3 !== undefined) {
                            for (let i = 0; i < this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType3.length; i++) {
                                const q = this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType3[i];
                                this.submitContent(q.examAnswerPaperDTO.answerContent,q); // 样式修改，答题记录保存
                                /*if (q.examAnswerPaperDTO.answerContent === null) { // 没有答题记录
                                } else { // 有答题记录
                                    this.submitContent(q.examAnswerPaperDTO.answerContent,q); // 样式修改，答题记录保存
                                }*/
                            }
                        }
                        // 简答题 查看是否有答题记录并回显
                        if (this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType4 !== undefined) {
                            for (let i = 0; i < this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType4.length; i++) {
                                const q = this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType4[i];
                                this.submitContent(q.examAnswerPaperDTO.answerContent,q); // 样式修改，答题记录保存
                                /*if (q.examAnswerPaperDTO.answerContent === null) { // 没有答题记录
                                } else { // 有答题记录
                                    this.submitContent(q.examAnswerPaperDTO.answerContent,q); // 样式修改，答题记录保存
                                }*/
                            }
                        }
                        // 论述题 查看是否有答题记录并回显
                        if (this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType5 !== undefined) {
                            for (let i = 0; i < this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType5.length; i++) {
                                const q = this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType5[i];
                                this.submitContent(q.examAnswerPaperDTO.answerContent,q); // 样式修改，答题记录保存
                                /*if (q.examAnswerPaperDTO.answerContent === null) { // 没有答题记录
                                } else { // 有答题记录
                                    this.submitContent(q.examAnswerPaperDTO.answerContent,q); // 样式修改，答题记录保存
                                }*/
                            }
                        }
                        // 计算题 查看是否有答题记录并回显
                        if (this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType6 !== undefined) {
                            for (let i = 0; i < this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType6.length; i++) {
                                const q = this.simulationExam.examPaperDTO.questionCopyDTOMap.questionType6[i];
                                this.submitContent(q.examAnswerPaperDTO.answerContent,q); // 样式修改，答题记录保存
                                /*if (q.examAnswerPaperDTO.answerContent === null) { // 没有答题记录
                                } else { // 有答题记录
                                    this.submitContent(q.examAnswerPaperDTO.answerContent,q); // 样式修改，答题记录保存
                                }*/
                            }
                        }
                    }
                    // 考试时长
                    this.timeParams.minute = this.simulationExam.examPaperDTO.suggestTime;
                    if ('0' === this.queryParams.examType || '2' === this.queryParams.examType ) { // 在线考试
                        this.timeParams.minute = this.simulationExam.remainingTime;
                    }
                    // 开始倒计时考试
                    this.countDown();
                }
            }).finally(() => {
                this.loading = false
            })
        }
    }
}
</script>

<style scoped>
    /*dialog-footer 内边距*/
    /deep/ .el-dialog__body {
        padding: 10px 15px 20px 15px;
    }
    .main2{
        height: 100%;
        margin: auto;
        background-color: #f0f2f5 !important;
    }
    .main{
        width: 1400px;
        height: 100%;
        margin: auto;
        background-color: #f0f2f5 !important;
    }
    .top{
        height: 135px;
        padding-top: 49px;
    }
    .projectname{
        height: 24px;
        line-height: 24px;
        font-size: 24px;
        font-family: Source Han Sans CN;
        /*font-weight: bold;*/
        color: #333333;
    }
    .projectinfo{
        height: 19px;
        line-height: 19px;
        font-size: 18px;
        font-family: Source Han Sans CN;
        font-weight: 400;
        color: #666666;
        margin: 19px 0 30px 0;
    }
    .infoclass{
        text-align: center;
    }
    .mainbody{
        width: initial;
        height: calc(100% - 170px);
    }
    .left{
        width: 260px;
        float: left;
    }
    /* p标签不换行 */
    /deep/ p{
        display: inline;
    }

    .tabsRight{
        width: 237px;
        height: 205px;
        overflow-y: auto;
        float: right;
    }
    .tabsRight::-webkit-scrollbar{width:5px}
    .tabsRight::-webkit-scrollbar-track{background-color: #d4d2d2;}
    .tabsRight::-webkit-scrollbar-thumb{background-color:rgb(179, 176, 176);}

    .right{
        width: 1120px;
        height: 100%;
        overflow-y: auto;
        float: right;
    }
    .right::-webkit-scrollbar{width:4px}
    .right::-webkit-scrollbar-track{background-color:#ccc;}
    .right::-webkit-scrollbar-thumb{background-color:rgb(179, 176, 176);}
    .infos{
        background: #FFFFFF;
        padding: 30px 0 13px 0;
    }
    .row {
        position: relative;
        width: 89%;
        height: 100%;
        margin: 0 auto;
        margin-bottom: 10px;
    }
    .row label{
        height: 17px;
        font-size: 18px;
        font-family: Source Han Sans CN;
        font-weight: 400;
        color: #333333;
    }
    .row span{
        height: 18px;
        font-size: 18px;
        font-family: Source Han Sans CN;
        font-weight: bold;
        color: #333333;
    }
    .iteminfo{
        background: #FFFFFF;
        padding: 20px 20px 0px 20px;
    }
    .row .countdown{
        color: red;
    }
    .row .circle{
        border-radius: 50%;
        height: 2em;
        width: 2em;
        font-size: 18px;
        font-family: Source Han Sans CN;
        font-weight: normal;
        border: 1px solid rgba(118, 118, 118, 0.97);
        color: rgba(118, 118, 118, 0.97);
        justify-content: center;
        align-items: center;
        text-align: center;
        display: flex;
        float: left;
        margin: 5px;
    }
    /*选中或鼠标悬浮后样式颜色不变 */
    .row .circle:hover{
        border: 1px solid rgba(118, 118, 118, 0.97);
        color: rgba(118, 118, 118, 0.97);
    }
    .row .circle:focus{
        border: 1px solid rgba(118, 118, 118, 0.97);
        color: rgba(118, 118, 118, 0.97);
    }
    .row .active{
        background: #1890ff;
        color: #FFFFFF;
        border: 1px solid #1890ff;
    }
    /*选中或鼠标悬浮后样式颜色不变 */
    .row .active:hover{
        background: #1890ff;
        color: #FFFFFF;
        border: 1px solid #1890ff;
    }
    .row .active:focus{
        background: #1890ff;
        color: #FFFFFF;
        border: 1px solid #1890ff;
    }

    .row .submit{
        width: 200px;
        height: 48px;
        background: #0F70E6;
        border-radius: 24px;
        border: none;
        margin-top: 40px;
        span{
            height: 23px;
            font-size: 24px;
            font-family: Source Han Sans CN;
            font-weight: 400;
            color: #FFFFFF;
        }
    }
    .itemType{
        width: 132px;
        height: 37px;
        line-height: 37px;
        background-image: url("~@/assets/others/rectangle.png");
    }
    .itemrow {
        position: relative;
        margin: 0 auto;
        margin: 10px 0;
    }
    .itemrow label{
        height: 24px;
        font-size: 16px;
        font-family: Source Han Sans CN;
        font-weight: 500;
        color: #333333;
        margin: 0 11px;
    }
    .itemrow div{
        font-family: Microsoft YaHei;
        font-weight: 400;
        color: #666666;
        line-height: 24px;
        margin-top: 20px;
        margin: 16px 33px 0 33px;
        label{
            /*width: 11px;*/
            width: auto;
        }
    }
    .itemrow .underlineinput {
      -webkit-box-ordinal-group: 11;
      order: 10;
      -ms-flex-order: 10;
      outline: none;
      border: none;
      width: 40%;
      padding: 10px 0;
      font-size: 16px;
      border-bottom: 1px solid #d5d5d5;
      text-indent: 10px;
    }
    .answerClass {
        padding-bottom: 10px;
    }
</style>
